<script setup lang="ts">
import { ref } from "vue";
import Upload from "./components/Upload.vue";

const textarea1 = ref("");
const textarea2 = ref("");
</script>

<template>
  <div>
    <el-card style="margin: 50px auto">
      <template #header>
        <div class="card-header">
          <span>客户端</span>
        </div>
      </template>
      <div>
        <span>登录图片:</span>
        <Upload />
        <Upload />
        <Upload />
        <Upload />
        <Upload />
      </div>
      <div style="margin-top: 20px">
        <span>logo图: </span>
        <Upload />
      </div>
    </el-card>
    <el-card style="margin: 50px auto">
      <template #header>
        <div class="card-header">
          <span>供应商端</span>
        </div>
      </template>

      <div>
        <span>登录图片:</span>
        <Upload />
        <Upload />
        <Upload />
        <Upload />
        <Upload />
      </div>
      <div style="margin-top: 20px">
        <span>logo图: </span>
        <Upload />
      </div>
    </el-card>
    <el-card style="margin: 50px auto">
      <template #header>
        <div class="card-header">
          <span>货代端</span>
        </div>
      </template>
      <div>
        <span>登录图片:</span>
        <Upload />
        <Upload />
        <Upload />
        <Upload />
        <Upload />
      </div>
      <div style="margin-top: 20px">
        <span>logo图: </span>
        <Upload />
      </div>
    </el-card>
    <el-card style="margin: 50px auto">
      <template #header>
        <div class="card-header">
          <span>平台端</span>
        </div>
      </template>
      <div>
        <span>登录图片:</span>
        <Upload />
        <Upload />
        <Upload />
        <Upload />
        <Upload />
      </div>
      <div style="margin-top: 20px">
        <span>logo图: </span>
        <Upload />
      </div>
    </el-card>
    <!-- 邮件模版 -->
    <el-card style="margin: 50px auto">
      <template #header>
        <div class="card-header">
          <span>邮件模版</span>
        </div>
      </template>
      <div>
        <span>工序节点邮箱:</span>
        <el-input
          v-model="textarea1"
          style="width: 500px"
          :autosize="{ minRows: 2, maxRows: 4 }"
          type="textarea"
          placeholder="多行输入"
        />
        <br />
        <br />
        <span>询价提醒邮箱:</span>
        <el-input
          v-model="textarea2"
          style="width: 500px"
          :autosize="{ minRows: 2, maxRows: 4 }"
          type="textarea"
          placeholder="多行输入"
        />
      </div>
    </el-card>
    <!-- 开票信息 -->
    <el-card style="margin: 50px auto">
      <template #header>
        <div class="card-header">
          <span>开票信息</span>
        </div>
      </template>
      <div>
        <span>开票提醒:</span>
      </div>
    </el-card>
    <div>
      <el-button type="primary"> 保存 </el-button>
      <el-button type="primary" plain>取消</el-button>
    </div>
  </div>
</template>

<style lang="scss" scoped></style>
